@use 'sass:map';
@use 'node_modules/@angular/material' as mat;
@use '@gravitee/ui-particles-angular' as gio;

$primary: map.get(gio.$mat-theme, primary);

.right {
  margin-left: 4px;
  cursor: pointer;
  color: mat.get-color-from-palette($primary);

  &:not(.clicked):not(.always-visible) {
    opacity: 0;
  }

  &.clicked {
    opacity: 1;
    color: mat.get-color-from-palette(gio.$mat-success-palette, 'medium');
  }
}

:host(:hover) {
  .right {
    opacity: 0.42;

    &:hover {
      opacity: 1;
    }
  }
}
